import styles from '../css/orderPay.module.css'
import { LocationFill } from 'antd-mobile-icons'
import { Tag } from 'antd-mobile'

function TrainCard(props) {
  const train = props.order_info.train

  return (
    <div className={styles.TrainCard}>
      <div className={styles.left}>
        <span className={styles.day}>{train.startDay}</span>
        <span className={styles.time}>{train.startTime}</span>
        <span>
          {train.startStation}
          <LocationFill
            color="#15A5C9"
            fontSize={20}
          />
        </span>
      </div>

      <div className={styles.middle}>
        <span>
          <Tag
            color="primary"
            fill="outline"
            className={styles.tag}
          >
            经停信息
          </Tag>
        </span>
        <span className={styles.trainNo}>{train.trainNo}</span>
      </div>

      <div className={styles.right}>
        <span className={styles.day}>{train.endDay}</span>
        <span className={styles.time}>{train.endTime}</span>
        <span>
          <LocationFill
            color="#15A5C9"
            fontSize={20}
          />
          {train.endStation}
        </span>
      </div>
    </div>
  )
}

export default TrainCard
